<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <title>目标表</title>
    <script src="../../../static/kaige/js/szload.js"></script>
</head>

<body>
<div class="kaige-body">
    <table class="layui-table" id="pageTable" lay-filter="pageTable" lay-size="sm"></table>
    <input type="hidden" name="keywordsCache" value="{}"/>
</div>

<script>
    load_init_js(function () {
        layui.config({
            base: szoapcpath + '/static/kaige/layuiextend/'
        }).use(['element', 'table', 'form', 'layer', 'kaige', 'laydate', 'slider'], function () {
            var element = layui.element,
                layer = layui.layer,
                table = layui.table,
                form = layui.form,
                router = layui.router(),
                laydate = layui.laydate,
                slider = layui.slider,
                kaige = layui.kaige
            $ = layui.$;
            form.render();

            kaige.table({
                elem: '#pageTable',
                url: "/crm.achievement/index",
                id: 'pageTable',
                toolbar: '#dtoolbar',
                defaultToolbar: ['filter'],
                cols: [[
                    {field: 'id', title: '', align: 'center', width: 50},
                    {field: 'target_type', title: '类型', align: 'center', templet: "#targetType"},
                    {field: 'user_name', title: '对象名称', align: 'center'},
                    {field: 'year', title: '年', align: 'center'},
                    {field: 'january', title: '一月', align: 'center'},
                    {field: 'february', title: '二月', align: 'center'},
                    {field: 'march', title: '三月', align: 'center'},
                    {field: 'april', title: '四月', align: 'center'},
                    {field: 'may', title: '五月', align: 'center'},
                    {field: 'june', title: '六月', align: 'center'},
                    {field: 'july', title: '七月', align: 'center'},
                    {field: 'august', title: '八月', align: 'center'},
                    {field: 'september', title: '九月', align: 'center'},
                    {field: 'october', title: '十月', align: 'center'},
                    {field: 'november', title: '十一月', align: 'center'},
                    {field: 'december', title: '十二月', align: 'center'},
                    {field: 'yeartarget', title: '年目标', align: 'center'},
                    {title: '操作', toolbar: '#dtrbar', align: 'center', width: 150, fixed: 'right'}
                ]]
                , done: function () {
                    form.on('select(target_type)', function(data){
                        console.log(data.elem); //得到select原始DOM对象
                        console.log(data.value); //得到被选中的值
                        console.log(data.othis); //得到美化后的DOM对象
                    });
                }
            });

            laydate.render({
                elem: '#keywords_year'
                , value: new Date()
                , type: 'year'
            });


            //获取筛选表单
            function getsearchform() {
                var gfv = {
                    "year": $('#keywords_year').val(),
                }
                gfv.rnd = Math.random();
                return gfv;
            }

            //执行重载表格
            function reload_sxtable() {
                var where = getsearchform();
                if (JSON.stringify(where) == "{}") {
                    layer.msg('当前没有筛选条件！');
                    return;
                }
                setTimeout(function () {
                    //执行重载
                    table.reload('pageTable', {
                        height: 'full-30'  //必须写，有时候高度不出来
                        , page: {curr: 1} //置第一页
                        , where: where
                    });
                    $("#keywords_year").val(where['year']);
                }, 300);
            }

            //列表-监听表头工具栏事件dtoolbar
            table.on('toolbar(pageTable)', function (obj) {
                switch (obj.event) {
                    case 'btn-add':
                        btnadd();
                        reload_sxtable();
                        break;
                }
            });

            //列表-监听单元格行工具事件dtrbar
            table.on('tool(pageTable)', function (obj) {
                var that = this;
                var data = obj.data;
                switch (obj.event) {
                    case 'edit':
                        baredit(data);
                        break;
                    case 'del':
                        bardel(data);
                        break;
                }
            });

            //添加
            function btnadd() {
                var year = $("#keywords_year").val();
                szoa.post("/crm.achievement/add", {year: year}, function (data) {
                    if (data.status) {
                        layer.msg(data.msg);
                    } else {
                        layer.msg("操作异常!");
                    }
                });
            }

            window.cal = function () {
                var all = $("#january").val() * 1 + $("#february").val() * 1 + $("#march").val() * 1 +
                    $("#april").val() * 1 + $("#may").val() * 1 + $("#june").val() * 1 +
                    $("#july").val() * 1 + $("#august").val() * 1 + $("#september").val() * 1 +
                    $("#october").val() * 1 + $("#november").val() * 1 + $("#december").val() * 1;

                $("#yeartarget").val(all);

                var quarter = $("#january").val() * 1 + $("#february").val() * 1 + $("#march").val() * 1;
                $("#quarter_1").val(quarter);

                var quarter = $("#april").val() * 1 + $("#may").val() * 1 + $("#june").val() * 1;
                $("#quarter_2").val(quarter);

                var quarter = $("#july").val() * 1 + $("#august").val() * 1 + $("#september").val() * 1;
                $("#quarter_3").val(quarter);

                var quarter = $("#october").val() * 1 + $("#november").val() * 1 + $("#december").val() * 1;
                $("#quarter_4").val(quarter);
            }

            //编辑
            function baredit(d) {
                kaige.form({
                    url: "/crm.achievement/edit",
                    data: {id: d.id},
                    id: 'kaige',
                    area: ['750px', '550px'],
                    title: '<i class="layui-icon layui-icon-edit"></i> 编辑 - 业绩目标表',
                    tablelayid: 'pageTable',
                    overflow: false,
                    encode: 1,
                    callbefore: function (layero, index) {
                        cal();
                        $(".show_cal").each(function (i, item) {
                            $(item).on('change', function (e) {
                                cal();
                            });
                        })

                    },
                });
            }

            //删除
            function bardel(d) {
                layer.confirm('您确定删除吗？', {
                    title: '<i class="layui-icon layui-icon-delete"></i> 删除确认',
                    btn: ['确认', '取消']
                }, function () {
                    $.post("/crm.achievement/del", {id: d.id}, function (res) {
                        res.status && table.reload('pageTable');
                        layer.msg(res.msg);
                    });
                });
            };

        });
    });
</script>

<script type="text/html" id="dtrbar">
    <div class="layui-btn-group">
        <button class="layui-btn layui-btn-xs" lay-event="edit" title="编辑"><i class="layui-icon layui-icon-edit"></i>
        </button>
        <button class="layui-btn layui-btn-xs" lay-event="del" title="删除"><i class="layui-icon layui-icon-delete"></i>
        </button>
    </div>
</script>

<script type="text/html" id="dtoolbar">
    <div class="layui-btn-container layui-form filter-form" lay-filter="searchform">
        <div class="layui-input-inline">
            <input class="layui-input tsinput" name="keywords_year" placeholder="年份" id="keywords_year">
            <button class="tsbutton" lay-event="btn-add" id="btn-add" title="生成">
                <i class="layui-icon layui-icon-add-circle"></i>
            </button>
        </div>
    </div>
</script>
<script type="text/html" id="targetType">
    {{# if(d.target_type==1){ }}
    <span>合同金额</span>
    {{# }else{ }}
    <span>回款目标</span>
    {{# } }}
</script>
<script type="text/html" id="kaige_form_html">
    <form class="layui-form layui-form-pane kaige-body-form" style="padding: 5px;" lay-filter="kaige_form_lay_filter">
        {{# if(d.id){ }}
        <input type="hidden" name="id" value="{{ d.id }}"/>
        {{# } }}
        <div class="layui-form-item">
            <label class="layui-form-label">年</label>
            <div class="layui-input-inline">
                <input name="year" value="{{ d.year || '' }}" class="layui-input" type="text" disabled="disabled">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">第一季度</label>
            <div class="layui-input-inline">
                <input name="quarter" value="" class="layui-input" type="text" id="quarter_1" readonly="readonly">
            </div>

            <label class="layui-form-label">一月</label>
            <div class="layui-input-inline">
                <input id="january" name="january" onkeyup="value=value.replace(/^(0+)|[^\d.]+/g,'')"
                       value="{{ d.january || '' }}" class="layui-input show_cal" type="text" lay-verify="required">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">二月</label>
            <div class="layui-input-inline">
                <input id="february" name="february" onkeyup="value=value.replace(/^(0+)|[^\d.]+/g,'')"
                       value="{{ d.february || '' }}" class="layui-input show_cal" type="text" lay-verify="required">
            </div>
            <label class="layui-form-label">三月</label>
            <div class="layui-input-inline">
                <input id="march" name="march" onkeyup="value=value.replace(/^(0+)|[^\d.]+/g,'')"
                       value="{{ d.march || '' }}" class="layui-input show_cal" type="text" lay-verify="required">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">第二季度</label>
            <div class="layui-input-inline">
                <input name="quarter_2" value="" class="layui-input" type="text" id="quarter_2">
            </div>
            <label class="layui-form-label">四月</label>
            <div class="layui-input-inline">
                <input id="april" name="april" onkeyup="value=value.replace(/^(0+)|[^\d.]+/g,'')"
                       value="{{ d.april || '' }}" class="layui-input show_cal" type="text" lay-verify="required">
            </div>

        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">五月</label>
            <div class="layui-input-inline">
                <input id="may" name="may" onkeyup="value=value.replace(/^(0+)|[^\d.]+/g,'')"
                       value="{{ d.may || '' }}" class="layui-input show_cal" type="text" lay-verify="required">
            </div>
            <label class="layui-form-label">六月</label>
            <div class="layui-input-inline">
                <input id="june" name="june" onkeyup="value=value.replace(/^(0+)|[^\d.]+/g,'')"
                       value="{{ d.june || '' }}" class="layui-input show_cal" type="text" lay-verify="required">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">第三季度</label>
            <div class="layui-input-inline">
                <input name="quarter_3" value="" class="layui-input" type="text" id="quarter_3">
            </div>
            <label class="layui-form-label">七月</label>
            <div class="layui-input-inline">
                <input id="july" name="july" onkeyup="value=value.replace(/^(0+)|[^\d.]+/g,'')"
                       value="{{ d.july || '' }}" class="layui-input show_cal" type="text" lay-verify="required">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">八月</label>
            <div class="layui-input-inline">
                <input id="august" name="august" onkeyup="value=value.replace(/^(0+)|[^\d.]+/g,'')"
                       value="{{ d.august || '' }}" class="layui-input show_cal" type="text" lay-verify="required">
            </div>
            <label class="layui-form-label">九月</label>
            <div class="layui-input-inline">
                <input id="september" name="september" onkeyup="value=value.replace(/^(0+)|[^\d.]+/g,'')"
                       value="{{ d.september || '' }}" class="layui-input show_cal" type="text" lay-verify="required">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">第四季度</label>
            <div class="layui-input-inline">
                <input name="quarter_4" value="" class="layui-input" type="text" id="quarter_4">
            </div>

            <label class="layui-form-label">十月</label>
            <div class="layui-input-inline">
                <input id="october" name="october" onkeyup="value=value.replace(/^(0+)|[^\d.]+/g,'')"
                       value="{{ d.october || '' }}" class="layui-input show_cal" type="text" lay-verify="required">
            </div>

        </div>
        <div class="layui-form-item">

            <label class="layui-form-label">十一月</label>
            <div class="layui-input-inline">
                <input id="november" name="november" onkeyup="value=value.replace(/^(0+)|[^\d.]+/g,'')"
                       value="{{ d.november || '' }}" class="layui-input show_cal" type="text" lay-verify="required">
            </div>

            <label class="layui-form-label">十二月</label>
            <div class="layui-input-inline">
                <input id="december" name="december" onkeyup="value=value.replace(/^(0+)|[^\d.]+/g,'')"
                       value="{{ d.december || '' }}" class="layui-input show_cal" type="text" lay-verify="required">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">年目标</label>
            <div class="layui-input-inline">
                <input name="yeartarget" value="{{ d.yeartarget || '' }}" class="layui-input" type="text"
                       id="yeartarget">
            </div>
        </div>

        <div class="layui-form-item layui-hide">
            <button class="layui-hide" lay-submit="" id="kaige_form_btn_save" lay-filter="kaige_form_btn_save">保存数据
            </button>
        </div>
    </form>
</script>
</body>

</html>